// Copyright (c) 2017 Florian Klampfer <https://qwtel.com/>
//
// This program is free software: you can redistribute it and/or modify
// it under the terms of the GNU General Public License as published by
// the Free Software Foundation, either version 3 of the License, or
// (at your option) any later version.
//
// This program is distributed in the hope that it will be useful,
// but WITHOUT ANY WARRANTY; without even the implied warranty of
// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
// GNU General Public License for more details.
//
// You should have received a copy of the GNU General Public License
// along with this program.  If not, see <http://www.gnu.org/licenses/>.

// <<< INLINE
.page {
  margin-bottom: 3em;

  li + li {
    margin-top: .25rem;
  }

  > header {
    position: relative;
    margin-bottom: 2rem;
  }

  .aspect-ratio.sixteen-nine.lead {
    @extend .border-radius;
  }
}

body:not(.no-third-column) {
  .page > header {
    > .lead + .note-sm, 
    > a.no-hover + .note-sm {
      @media screen and (min-width: $break-point-dynamic) {
        position: absolute;
        right: -25rem;
        width: 21rem;
        bottom: 0;
        margin-bottom: 0;
      }
    }
  }
}

// Blog post or page title
.page-title, .post-title { margin-top: 0; }

// Meta data line below post title
.post-date {
  @extend .h4;
  display: flex;
  justify-content: space-between;
  margin-top: -.6rem;
  height: 2rem;
  margin-bottom: .85rem;
  color: var(--gray);

  > .ellipsis {
    cursor: pointer;
  }

  [class^="icon-"] { 
    display: inline-block; 
    font-size: smaller;
    margin-right: .25rem;
  }
}
// >>>
// <<< LINK
clap-button {
  margin-left: auto;
  margin-right: auto;
  --clap-button-color: var(--accent-color);
}

clap-button + p.message {
  margin: -2rem auto 0;
  max-width: 32rem;
  font-size: smaller
}

hr.dingbat {
  border: 0;
  &:after{
    content: "\2756";
    display: block;
    text-align: center;
    font-size: 1.5rem;
    color: var(--menu-text);
  }
}

@media print {
  .page {
    margin-bottom: 0
  }
}
// >>>
